<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>文本框输入内容和标签内容同步</title>
</head>
<body>
<div id="change" class="change">
    <label for="name">账户</label><input type="text" name="name" id="name" placeholder="请输入账号" value="">
    <br>
    <label for="content"></label>
</div>

<script !src="">
    let name = "abc"
    // 获取 HTML 页面中的目标元素
    let element_input = document.querySelector("#change #name");
    // console.log(element_input);

    // let element_show = document.querySelector("label[for='content']");
    let element_show = document.querySelector("div label:last-child");
    // console.log(element_show);

    /*element_input.addEventListener(
        "input",
        function (event) {
            console.log(event);
        }
    )*/

    element_input.addEventListener(
        "input",
        (event) => {
            // console.log(event.target.value);
            element_show.innerText = event.target.value
        }
    )

    element_input.value = name
    element_show.innerText = name
</script>
</body>
</html>